@function px2rem($px) {
  // 根元素字体为100px
  @return $px / 100 * 1rem;
}
html,
body {
  width: 100%;
  background-color: #fff;
}
// 修改 input 框浏览器记住密码 默认颜色和字体
input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill {
  -webkit-box-shadow: 0 0 0px 1000px transparent inset !important;
  background-color: transparent !important; //设置input框记住密码背景颜色
  background-image: none;
  transition: background-color 50000s ease-in-out 0s;
  -webkit-text-fill-color: #222 !important; //设置浏览器默认密码字体颜色
}

.invitation {
  font-size: px2rem(30);
  .tar {
    text-align: right;
  }
  .tac {
    text-align: center;
  }

  .top {
    .language {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      padding: px2rem(48);
      padding-top: px2rem(100);

      .cn {
        font-weight: 700;
        color: #333947;
        margin: 0 px2rem(8);
      }

      .icon-checkout {
        display: block;
        width: px2rem(32);
        height: px2rem(32);
        background: url("../../assets/images/login/arrow-down.png") no-repeat;
        background-size: 100% 100%;
      }
    }

    .code {
      margin-top: px2rem(66);
      padding-left: px2rem(48);
      .code-title {
        font-size: px2rem(64);
        color: #0066ff;
      }

      .welcome {
        color: #666;
        margin-top: px2rem(30);
      }
    }
  }

  .form {
    margin: px2rem(160) auto;
    padding: 0 px2rem(48);

    &-item {
      margin-top: px2rem(40);
      .pwd {
        position: relative;
        input {
          background-color: #f8f8f8;
        }
        .eye,
        .eye-open {
          width: px2rem(40);
          height: px2rem(40);
          background: url("../../assets/images/login/eye.png") no-repeat;
          background-size: 100% 100%;
          display: block;
          position: absolute;
          right: px2rem(40);
          top: px2rem(40);
        }
        .eye-open {
          background: url("../../assets/images/login/eye-open.png") no-repeat;
          background-size: 100% 100%;
        }
      }
      .auth-code {
        position: relative;
        input {
          background-color: #f8f8f8;
        }
        .code {
          width: px2rem(240);
          height: px2rem(88);
          display: block;
          position: absolute;
          right: px2rem(40);
          top: px2rem(12);
        }
      }
      .check-title {
        display: flex;
        justify-content: space-between;
        margin-bottom: px2rem(10);
        .right {
          color: #e46050;
          font-size: px2rem(28);
        }
      }
    }

    .form-title {
      color: #333;
      margin-bottom: px2rem(10);
    }

    .ipt {
      height: px2rem(112);
      line-height: px2rem(112);
      background-color: #fff;
      border-radius: px2rem(16);
      padding: 0 px2rem(30);
      width: px2rem(654);
      box-sizing: border-box;

      &.bd {
        border: 1px solid #e46050;
      }
    }

    .btn {
      width: px2rem(654);
      height: px2rem(96);
      background: #0066ff;
      border-radius: px2rem(48);
      display: flex;
      align-items: center;
      justify-content: center;
      color: #fff;
      margin: px2rem(80) auto;
      font-size: px2rem(32);
      font-weight: 500;
    }

    .txt-btns {
      display: flex;
      color: #666;
      .left,
      .right {
        text-align: center;
        flex: 1;
      }
      .left {
        border-right: px2rem(2) solid #eee;
      }
    }
  }

  .privacy {
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    width: 100%;
    left: 0;
    bottom: px2rem(20);
    .blue {
      color: #0066ff;
      position: relative;
      top: px2rem(-4);
    }
  }
}
